import {useState} from 'react';
import {Layout, ConfigProvider,Spin} from 'antd';
// 引入 antd 的中文语言包
import zhCN from 'antd/lib/locale/zh_CN';
import dayjs from 'dayjs';
window.dayjs = dayjs
import 'dayjs/locale/zh-cn';
dayjs.locale('zh-cn');
import {Outlet} from "react-router-dom";
import HeaderCom from '@/components/header.tsx'
import SidebarCom from '@/components/sidebar.tsx'
import {useSelector} from "react-redux";
const {Sider, Content} = Layout;
import FullScreenLoading from '@/components/FullScreenLoading.tsx'
const Home = () => {
    const {collapsed, loading} = useSelector(state => state.userSlice)
    return (
        <ConfigProvider locale={zhCN} theme={{
            token: {
                // Seed Token，影响范围大
                colorPrimary: '#39BFAC',
                // colorBgContainer: '#000000',
            },
        }}>
            {loading?<FullScreenLoading />:null}
            <Layout className="home-page">
                <Sider trigger={null} collapsible collapsed={collapsed} style={{background: '#282D36'}} className={collapsed?'sider-collapsed':''}>
                    <SidebarCom />
                </Sider>
                <Layout>
                    <HeaderCom />
                    <Content className="page-content">
                        <Outlet />
                    </Content>
                </Layout>
            </Layout>
        </ConfigProvider>
    );
};

export default Home;